/* @font-face { font-family: 'AachenBTBold'; src: url('http://peterhans.bwise.ch/www_pfefferle/pages/css/aachenbt_bold-webfont.eot'); src: local('☺'), url('http://peterhans.bwise.ch/www_pfefferle/pages/css/aachenbt_bold-webfont.woff') format('woff'), url('http://peterhans.bwise.ch/www_pfefferle/pages/css/aachenbt_bold-webfont.ttf') format('truetype'), url('http://peterhans.bwise.ch/www_pfefferle/pages/css/aachenbt_bold-webfont.svg#webfontGfmG86GH') format('svg'); font-weight: normal; font-style: normal; } * { margin: 0; padding: 0; } */ /* ############################################ Gerüst ############################################ */ html { background: #f9f9f9; } body { font: 12px Arial, Helvetica, sans-serif; margin: 0px; color: #000000; min-height: 100%; padding: 0 10px; background: #e7f0f5; /* Old browsers */ background: -moz-linear-gradient(top, #e7f0f5 1%, #f9f9f9 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#e7f0f5), color-stop(100%,#f9f9f9)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #e7f0f5 1%,#f9f9f9 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #e7f0f5 1%,#f9f9f9 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #e7f0f5 1%,#f9f9f9 100%); /* IE10+ */ background: linear-gradient(to bottom, #e7f0f5 1%,#f9f9f9 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e7f0f5', endColorstr='#f9f9f9',GradientType=0 ); /* IE6-9 */ } #main_container { background-color: #ffffff; box-shadow: 0 0 5px #646464; } #content.cms { width: 740px; padding: 0 !important; } #content.shop { box-sizing: border-box; padding: 15px 40px 15px 15px !important; } #content.shop * { box-sizing: border-box; border-collapse: collapse; } body a { color: #0076ad; } body a:hover { color: #004C70; } h1 { color: #0076ad !important; } .w150 { width: 150px; } .imgCol img { padding-bottom: 20px; } /* For the cms */ .grp { clear: both; } .img_cms.L { margin: 0 20px 10px 0; padding-top: 3px; } .img_cms.LT { margin: 0 20px 10px 0; } .img_cms.R { margin: 0 0 10px 20px; padding-top: 3px; } .img_cms.RT { margin: 0 0 10px 20px; } /* #################################################################################################################################### Header #################################################################################################################################### */ body div#header { background: none; position: relative; } body div#header_box { position: relative; height: 100px; } body div#header_image { display: block; float: left; height: 100px; width: 211px; margin-left: 20px; background: url('/www_pfefferle/pages/img/Logo_epure.jpg') no-repeat center; background-size: contain; } body div#certified_box { position: absolute; right: 20px; top: 10px; } body div#certified_box img { margin-left: 10px; } #search_container, #search_container * { box-sizing: border-box; } #search_container { position: absolute; right: 15px; bottom: 48px; width: 610px; border-width: 5px; border-style: solid; border-color: #ffffff #ffffff #ffffff #ffffff; } #search_container > div { position: relative; height: 36px; } #search_container input[type="text"]{ width: 100%; height: 36px; padding: 4px 40px 4px 14px; border-width: 1px 1px 1px 1px; border-style: solid; border-color: #e5e5e5; line-height: 26px; } #search_container input[type="submit"]{ position: absolute; right: 1px; top: 1px; width: 35px; height: 35px; border: none; background: url("/www_pfefferle/pages/img/search_black.svg") no-repeat center #e5e5e5; background-size: 50% auto; border-radius: 0; box-shadow: none; } #search_container input[type="submit"]:hover { background: url("/www_pfefferle/pages/img/search_dc291a.svg") no-repeat center #e5e5e5; background-size: 50% auto; cursor: pointer; } #search_container.busy input[type="submit"] { background: url("/www_pfefferle/pages/img/loader.gif") no-repeat center #e5e5e5; background-size: auto; cursor: pointer; } header #search_container div { position: relative; } .ui-autocomplete.searchResult { display: block !important; z-index: 1000 !important; width: 100% !important; max-height: 85vH; overflow-y: auto; padding: 0; background: none; border: none !important; box-shadow: 0 5px 10px rgba( 0,0,0,0.2 ); } .ui-autocomplete.searchResult li { margin: 0 !important; padding: 0 !important; list-style: none; border: 0 !important; background: #e5e5e5); } .ui-autocomplete.searchResult li a { display: block; margin: 0; padding: 5px; background: #e5e5e5; color: #000000; border: 0 !important; } .ui-autocomplete.searchResult li a .sThumb { line-height: 1px; } .ui-autocomplete.searchResult li a .sThumb div { margin: 0 10px 0 0; padding: 4px; background: rgba(255,255,255,1); } .ui-autocomplete.searchResult li a .sThumb div div { width: 44px; height: 44px; margin: 0; padding: 0; background-repeat: no-repeat; background-position: center; background-size: contain; } .ui-autocomplete.searchResult li a .sText { padding: 0; vertical-align: middle; line-height: 18px; font-weight: bold; font-size: 12px;} .ui-autocomplete.searchResult li.ui-state-focus a, .ui-autocomplete.searchResult li:hover a { background: #99ddff; } #crump, #crump * { box-sizing: border-box; margin: 0; padding: 0; } .shop #crump ul { padding: 5px 0 0 10px; } .cms #crump ul { padding-top: 15px; } #crump ul:after { display: block; content: ""; clear: both; } #crump ul li { float: left; list-style: none; } #crump ul li a { display: block; position: relative; line-height: 25px; padding-left: 20px; color: #a5a5a5; } #crump ul li a:hover { color: #2c2c2c; } #crump ul li a:after { position: absolute; left: -20px; top: 0; width: 20px; content: ">"; line-height: 25px; padding-left: 20px; text-align: center; color: #a5a5a5; } #crump ul li:first-child a { padding-left: 0; } #crump ul li:first-child a:after, #crump ul li#shop_prevnext a:after, #crump ul li#shop_prevnext li a:after { display: none; } #crump ul li#shop_prevnext { float: right; margin-right: -2px; } #crump ul li#shop_prevnext ul { padding: 0; } #crump ul li#shop_prevnext ul li { padding: 4px 0 0 20px; } #crump ul li#shop_prevnext ul li a { border-width: 8px 12px; border-style: solid; padding: 0; } #crump ul li#shop_prevnext ul li a.shop_prev { border-color: #ffffff #a5a5a5 #ffffff #ffffff; } #crump ul li#shop_prevnext ul li a.shop_next { border-color: #ffffff #ffffff #ffffff #a5a5a5; } #crump ul li#shop_prevnext ul li a.shop_prev:hover { border-color: #ffffff #2c2c2c #ffffff #ffffff; } #crump ul li#shop_prevnext ul li a.shop_next:hover { border-color: #ffffff #ffffff #ffffff #2c2c2c; } /*#searchBox { width: 200px; padding: 7px 0 0 15px; } #id_searchBox { float: left; width: 153px; height: 14px; padding: 5px 5px 0px 5px; border: 1px solid #f2f3f4; font-size: 11px; }*/ #headerNavigation { padding: 0px 200px 0px 0px; margin: 0; background: #0076ad; } #headerNavigation:after { display: block; content: ""; clear: both; } #headerNavigation li { list-style: none; float: left; } #headerNavigation li a { display: block; line-height: 26px; text-decoration: none; padding: 10px 20px; color: #ffffff; font-size: 20px; letter-spacing: 1px; } /*#headerNavigation li a:hover { background: #99DDFF; }*/ #headerNavigation li.current a, #headerNavigation li a:hover { background: #e04444; } /*#headerNavigation li:hover, #headerNavigation li.current { border-color: #e04444 #0076ad #0076ad #0076ad; border-width: 40px 12px 6px 12px; border-style: solid; } #headerNavigation li:hover a, #headerNavigation li.current a { margin: -40px 0 -6px 0; background: transparent; padding: 10px 13px; }*/ /*#headerNavigation li { position: relative; } #headerNavigation li:after { display: none; position: absolute; left: 0; bottom: 7px; height: 5px; width: 100%; background: #e04444; content: ""; } #headerNavigation li:hover:after, #headerNavigation li.current:after { display: block; }*/ #language_navi { position: absolute; right: 0; top: 112px; margin: 0; padding: 0 20px; } #language_navi li { list-style: none; float: left; } #language_navi li a { border-left: 2px solid #ffffff; margin-left: 8px; padding-left: 8px; color: #ffffff; font-weight: bold; line-height: 25px; } #language_navi li:first-child a { border-left: none; margin-left: 0; padding-left: 0; } #tool_navi { position: absolute; right: 70px; bottom: -38px; padding: 0 20px; margin: 0; } #tool_navi li { list-style: none; float: left; position: relative;; } #tool_navi li a { display: block; margin-left: 4px; width: 28px; height: 28px; border-radius: 5px; background-repeat: no-repeat; background-position: center; } #tool_navi li#disk_menu a { background-image: url(/www_pfefferle/pages/img/save_white_2.png); border-radius: 5px 5px 0 0; } #tool_navi li#tool_mail a { background-image: url(/www_pfefferle/pages/img/mail_white_2.png); } #tool_navi li#tool_print a { background-image: url(/www_pfefferle/pages/img/print_white_2.png); } #tool_navi li:hover a { background-color: #f1f1f1; } #tool_navi li#disk_menu:hover a { background-image: url(/www_pfefferle/pages/img/save.png); } #tool_navi li#tool_mail:hover a { background-image: url(/www_pfefferle/pages/img/mail.png); } #tool_navi li#tool_print:hover a { background-image: url(/www_pfefferle/pages/img/print.png); } #tool_navi ul { display: none; position: absolute; right: 0px; top: 20px; padding-top: 4px; margin: 0; z-index: 10000; } #tool_navi li:hover > ul { display: block; } #tool_navi ul li { float: none; display: block; } #tool_navi ul li a { height: auto; width: auto; padding: 1px 3px; border-radius: 0 !important; color: #343434; text-decoration: none; white-space: nowrap; background: #f1f1f1 !important; cursor: pointer; } #tool_navi ul li:first-child a { padding-top: 5px; border-radius: 5px 0 0 0 !important; } #tool_navi ul li:last-child a { padding-bottom: 5px; border-radius: 0 0 5px 5px !important; } #tool_navi ul li a:hover { color: #0076ad; } /* #################################################################################################################################### Basket #################################################################################################################################### */ #my_basket { position: fixed; right: 0; top: 187px; z-index: 100001; } #my_basket_toggler { position: relative; width: 40px; height: 50px; border-radius: 15px 0 0 15px; cursor: pointer; background: url('/www_pfefferle/pages/img/cart_white_24.png') no-repeat center #004C70; } #basket_counter { position: absolute; left: 8px; top: -12px; background: #99DDFF; width: 24px; height: 24px; border-radius: 12px; line-height: 24px; text-align: center; font-weight: bold; border: none; } #basket_counter.full { background: #bF0004; color: #ffffff; } #my_basket_warenkorb { display: none; } #warenkorb { width: 100px; height: 30px; padding: 10px; line-height: 15px; background: #0076ad; color: #ffffff; cursor: pointer; } /* #################################################################################################################################### Home #################################################################################################################################### */ #homeBox { padding: 15px 0 0 20px; } #eyeCatcherBox { margin-right: -20px; padding-bottom: 55px; } .eyeCatcher { display: block; float: left; width: 233px; height: 338px; margin: 0 21px 0 0 !important; } .eyeCatcher.eyeCatcherShop { background-image: url('/www_pfefferle/pages/img/home_shop_v2.png'); } .eyeCatcher.eyeCatcherShop.eyeCatcherShop2 { background-image: url('/www_pfefferle/pages/img/home_shop_v2_fr.png'); } /*.eyeCatcher.eyeCatcherHot li { list-style: none; padding-bottom: 13px; } .eyeCatcher.eyeCatcherHot li.last { padding-bottom: 0; } .eyeCatcher.eyeCatcherHot li a { display: block; padding-left: 18px; font-size: 20px; color: #3d3d3d; line-height: 58px; height: 58px; text-transform: uppercase; text-decoration: none; cursor: pointer; font-weight: bold; background: url('/www_pfefferle/pages/img/peterhans_homeArrow.png') no-repeat 200px center #f1f1f1; } .eyeCatcher.eyeCatcherHot li a.current { background-color: #e1e1e1; }*/ .eyeCatcher.eyeCatcherPdf { height: 338px; background-repeat: no-repeat; background-position: center; background-size: cover; cursor: pointer; } /*.eyeCatcher .eyeCatcherPdfFrame { display: block; background: url('/www_pfefferle/pages/img/peterhans_pdfFrame3.png') no-repeat; width: 225px; height: 205px; }*/ #homeAjaxAction { min-height: 252px; margin-right: 25px; background: url('/www_pfefferle/pages/img/loading_40x40_white.gif') no-repeat center; } #homeAjaxAction_inner { background: #ffffff; min-height: 225px; width: 720px; overflow: hidden; } #homeAjaxAction_overflow { margin-right: -50px; max-height: 285px; overflow: hidden; } .homeAjaxAction_title { color: #777777; text-transform: uppercase; font-size: 20px; font-weight: bold; padding-bottom: 15px; width: 720px; } #homeAjaxAction .hit_preis { padding-left: 0; } .homeAjaxAction_title_show_all { float: right; display: inline-block; font-weight: bold; font-size: 12px; padding: 0 0 0 39px; background: url(/pages/img/news_show_all_777777.png) no-repeat 21px center; } .homeAjaxAction_title_show_all:hover{ background: url(/pages/img/news_show_all_0076ad.png) no-repeat 21px center; color: #0076ad; cursor: pointer; } .home_topangebote { float: left; width: 224px; padding: 0 14px 0 0px; margin-right: 14px; border-right: 3px solid #ededed; } .home_topangebote a { display: block; position: relative; width: 224px; height: 245px; background-repeat: no-repeat; background-position: center; background-size: contain; } .home_topangebote a div { display: block; position: absolute; left: 0; bottom: 0; width: 200px; padding: 8px 12px; overflow: hidden; background: #0076ad; color: #ffffff; font-weight: bold; } /* ############################################ Main ############################################ */ #main { background-color:#ffffff; } /* ############################################ Menu Left ############################################ */ #menu_left { float: left; width: 210px; margin-left: 5px; } #menu_left ul { margin: 15px 0 0 0px; padding: 0px; } #menu_left ul li { list-style: none; margin: 0px; padding: 0px; } #menu_left ul li a { display: block; margin: 0; padding: 3px 0px 3px 20px; text-decoration: none; background-position: 5px 6px; background-repeat: no-repeat; } /* 1. Ebene */ #menu_left ul { background: /*#313131*/ #0076ad; } #menu_left ul li a { background-image: url(/www_pfefferle/pages/img/arrow_white.gif); color: #ffffff; font-weight: bold; } #menu_left ul li a:hover { background-color: #0076ad; } #menu_left ul li a.current { background-color: #99DDFF; background-image: url(/www_pfefferle/pages/img/arrow_down_white.gif); } /* 2. Ebene */ #menu_left ul ul { background: #efefef; } #menu_left ul ul li a { color: #000000; background-image: none; word-wrap: break-word; } #menu_left ul ul li a:hover { color: #0076ad; background-image: url(/www_pfefferle/pages/img/arrow.gif); background-color: transparent; } #menu_left ul ul li a.current, #menu_left ul ul li a.active { color: #0076ad; background-image: url(/www_pfefferle/pages/img/arrow_down.gif); background-color: transparent; } /* 3.+ Ebene */ #menu_left ul ul ul { background: #ffffff; } #menu_left ul ul ul li { padding-left: 20px; } /* ############################################ Content ############################################ */ #content { background-color:#ffffff; padding-bottom: 40px; } /* ############################################ Home ############################################ */ #eyecatchers #shop { float: left; width: 250px; height: 300px; margin-right: 5px; background: url(/www_pfefferle/pages/img/eyecatcher_shop_0.jpg); } #eyecatchers #shop:hover { background: url(/www_pfefferle/pages/img/eyecatcher_shop_1.jpg); } #eyecatchers #buero { float: left; width: 250px; height: 300px; background: url(/www_pfefferle/pages/img/eyecatcher_buero_0.jpg); } #eyecatchers #buero:hover { background: url(/www_pfefferle/pages/img/eyecatcher_buero_1.jpg); } #eyecatchers #katalog { float: right; width: 270px; height: 300px; background: url(/www_pfefferle/pages/img/eyecatcher_katalog_0.jpg) repeat-x; } #campaigns { margin: -15px -40px 0 -15px; background: #a5a5a5; } #campaigns * { padding: 0; margin: 0; } #campaigns ul { padding: 0 1vW; } #campaigns ul:after { display: block; content: ""; clear: both; } #campaigns ul li { float: left; list-style: none; padding-right: 10px; } #campaigns ul li a { display: block; padding: 0 10px; border-width: 5px; border-style: solid; border-color: #a5a5a5; font-size: 18px; font-weight: 300; text-transform: uppercase; color: #ffffff; line-height: 26px; } /*#campaigns ul li.current a { border-color: #0076ad #a5a5a5 #ffffff #a5a5a5; background: #ffffff; color: #0076ad; font-weight: normal; }*/ #campaigns ul li a:hover { color: #004968; } #campaigns ul li.current { border-color: #0076ad #a5a5a5 #ffffff #a5a5a5; border-width: 5px 10px 31px 10px; border-style: solid; padding-right: 0; margin-right: 10px; } #campaigns ul li.current a { margin: -5px 0 -31px 0; background: none; border-color: transparent; color: #0076ad; } .campaignArticle { position: relative; float:left; width:180px; height:270px; border: 5px solid #f1f1f1; margin-top:15px; margin-right:5px; } .campaignArticle p { margin: 0px; padding: 0px; } .campaignBrandImg { float:right; padding:0px; margin:0px; height:25px; width:70px; background-repeat:no-repeat; background-position:center; } .campaignAktionImg { float:left; padding:0px; margin:0px; } .campaignWarenkorbImg { position: absolute; top: 250px; left:86px; padding:0px; margin:0px; } .campaignDetailLink { position: absolute; top: 253px; left: 3px; } .campaignArticleText { font-family: Arial; font-size: 11px; color:#333333; font-weight:bold; margin-left:3px; margin-right:3px; } .campaignArticlePrice { color: #0076ad; /* font-family: "AachenBTBold"; */ font-family: Arial, Helvetica, sans-serif; font-weight:bold; font-size: 20px; margin-left:3px; } .campaignArticleAction { color: #000000; /* font-family: "AachenBTBold"; */ font-family: Arial, Helvetica, sans-serif; font-weight:bold; font-size: 12px; line-height:21px; padding-left:3px; } #campaignArticle a { font-family: Arial; font-size: 10px; color:#333333; line-height:20px; text-decoration:none; padding-left:3px; } #campaignArticle a:hover { text-decoration:underline; } /* ############################################ Footer ############################################ */ #footer { line-height: 30px; background: #fff; font-size: 11px; color: #a5a5a5; } #footer a { color: #a5a5a5; } #footer a:hover { color: #333; } /* ############################################ Varia ############################################ */ a { text-decoration: none; } a img { border: 0; } a:active, a:focus {outline: none} #auslauf { display:none; width:0px; } .oeffnungszeiten_titel { font-family: Arial, Helvetica, sans-serif; font-weight:bold; font-size: 14px; color: black; padding-left:0px; line-height:10px; } .oeffnungszeiten { font-family: Arial, Helvetica, sans-serif; font-weight:bold; font-size: 12px; color:black; padding-left:0px; } /*Code für LiveSearch*/ #resultBox { position:absolute; top:0px; left:0px; max-height:350px; min-width:0px; border: 1px solid; visibility:hidden; overflow:auto; background-color:#FFF; padding:0px; z-index:999999; } #resultBox ul { list-style-type:none; min-width:250px; background-color:#ffffff; padding:0px; margin:0px; } #resultBox li:hover{ /* background-color:#0000ff; color:white; */ cursor:pointer; } #resultBox li a{ display:block; line-height:18px; text-decoration:none; padding:0px 4px 0px 4px; height:20px; text-wrap:none; } #resultBox li a:hover{ background-color:#0076ad; color:#ffffff; text-decoration:none; cursor:pointer; } #searchAnimation { position:absolute; top:0px; left:0px; visibility:hidden; } #resultBox .resulthover a{ background: #0076ad; border-color:#0076ad !important; color:#ffffff !important; } /* ############################################ Shop ############################################ */ .sort_box_outer { border: 5px solid #f1f1f1; } .sort_box_outer_favoriten{ border: 5px solid #019235; } .sort_box_inner_head { -moz-border-radius: 0 0 0 0; border-radius: 0px; border-top:0px; border-left:0px; border-right:0px; border-bottom: 5px solid #f1f1f1; } .sort_box_inner_head_favoriten{ background-color:#019235; border-bottom: 5px solid #019235; } a.sortiment_box_inner_titel { /* font-family: "AachenBTBold"; */ font-family: "Arial", "Helvetica", sans-serif; font-size:12px; color:#343434; } a.sortiment_box_inner_titel_favoriten{ color:#ffffff; } .katalog_box_outer { border: 5px solid #f1f1f1; } .katalog_box_inner_titel { border-top:0px; border-left:0px; border-right:0px; border-bottom: 5px solid #f1f1f1; background-color: #f1f1f1; } a.katalog_box_titel { /* font-family: "AachenBTBold"; */ font-family: "Arial", "Helvetica", sans-serif; font-size:12px; color:#343434; } #container .yui-nav li { margin-bottom: -6px; } #container .yui-nav { margin-left: 1px; } /* ############################################ Shop Login ############################################ */ .shop_login input { border: 1px solid #f1f1f1; margin-top:5px; margin-left: 10px; } .shop_login_button { float:right; height: 43px; width: 45px; margin-left:0px; margin-right:2px; border: 2px solid #b31a2e; background-color:#e3001b; color:#ffffff; text-decoration: underline; font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:18px; } #box_sitemap a{ display:block; } #box_sitemap ul li a{ padding-top:10px; } #box_sitemap ul li ul li a{ padding-left:0px; padding-top:0px; } #box_sitemap ul{ list-style: none; } .hit_text { color: #333333; font-family: Arial; font-size: 11px; font-weight: bold; margin-left: 3px; margin-right: 3px; } .hit_preis { color: #0076ad; font-family: Arial,Helvetica,sans-serif; font-size: 20px; font-weight: bold; padding-left: 3px; } .hit_aktion { color: #000000; font-family: Arial,Helvetica,sans-serif; font-size: 12px; font-weight: bold; padding-left: 3px; } /* ############################################ Schlüssel Bestellformular ############################################ */ .key_order_input { width: 196px; } .contenttable { width: 100%; } .contenttable td { padding: 1px 10px 1px 0; vertical-align: top; } .contenttable td p { padding: 0; margin: 0; } .contenttable td:last-child { padding: 1px 0; } .contenttable td h2 { padding: 2px 5px; background: #f2f3f4; } .contenttable2 { width: 100%; } .contenttable2 td { padding: 0 10px 0 0; vertical-align: top; } .contenttable2 td p { padding: 0; margin: 0; } .contenttable2 td:last-child { padding: 00; } .contenttable2 td h2 { padding: 2px 5px; background: #f2f3f4; } .historic_date { font-weight: bold; } .charta { border: 9px double #FFD700; background: #FFFBE8; padding: 18px; } .charta p { text-align: justify; text-indent: 20px; } .address_list th { text-align: left; } .address_list th.address_department { padding: 2px; background: #f2f3f4; } .address_list td { font-size: 10px; padding: 1px 5px 1px 5px; border-bottom: 1px solid #d2d4d6; border-right: 1px solid #d2d4d6; } .address_list .contact_last td { border-bottom: none; } .address_list td:last-child { padding: 1px 0 1px 5px; border-right: none; } .address_list td:first-child { padding: 1px 5px 1px 0; } .address_list td.contact_number { white-space: nowrap; } .address_list td.contact_email { white-space: nowrap; } .touren li { list-style: none; font-weight: bold; } .touren li ul li { list-style: circle; font-weight: normal; } ul.sEleven_navi { margin: 0; } ul.sTen_navi { margin: 0; } #tab_container_inner { display: block !important; } .sTen_header div { line-height: 14px !important; } .sEleven_header div { height: 48px !important; line-height: 14px !important; } .sTen_image_container { padding: 3px !important; height: auto !important; } .sTen_image_container:after { display: block; content: ""; clear: both; } .sTen_image_frame { background: #ffffff; padding: 3px !important; border: 3px solid #e0e0e0; height: auto !important; } .sTen_image { height: auto !important; padding: 50%; } .sTen_image_container_large { height: auto !important; padding: 3px !important; } .sTen_image_frame_large { background: #ffffff; padding: 3px !important; border: 3px solid #e0e0e0; height: auto !important; } .sTen_image_large { padding: 24%; } .sEleven_image_container { padding: 3px !important; height: auto !important; } .sEleven_image_container:after { display: block; content: ""; clear: both; } .sEleven_image_frame { background: #ffffff; padding: 3px !important; border: 3px solid #e0e0e0; height: auto !important; } .sEleven_image { height: auto !important; padding: 50%; } /*-----| SIDE Navigation |--------------------------------------------------------------------------------------------------------------*/ nav#side_navi, nav#side_navi * { box-sizing: border-box; } nav#side_navi { position: fixed; z-index: 25; right: 0; top: 247px; width: 40px; } nav#side_navi ul { margin: 0 0 20px 0; background: rgba(0,146,207,1); border-radius: 10px 0 0 10px; } nav#side_navi ul li { position: relative; list-style: none; } nav#side_navi ul li a { display: block; height: 44px; background-repeat: no-repeat; background-position: center; background-color: rgba(0,0,0,0.5); } nav#side_navi ul li:hover a { background-color: #e04444; } nav#side_navi ul li:first-child a { border-top-left-radius: 10px; } nav#side_navi ul li:last-child a { border-bottom-left-radius: 10px; } nav#side_navi ul ul { display: none; position: absolute; right: 40px; top: 0; padding: 5px; background: rgba(255,144,0,1); border-radius: 10px 0 10px 10px; } nav#side_navi ul li:hover ul { display: block; } nav#side_navi ul ul li a { white-space: nowrap; color: #ffffff; height: auto; padding: 5px; cursor: pointer; } nav#side_navi ul ul li a:hover { background: rgba(0,0,0,1); } nav#side_navi ul ul li:first-child a { border-radius: 6px 6px 0 0; } nav#side_navi ul ul li:last-child a { border-radius: 0 0 6px 6px; } nav#side_navi #snBasket { position: relative; background-image: url('/pages2015/img/sn_basket.png'); } nav#side_navi #snBasket span { display: none; } nav#side_navi #snBasket.full { background-color: rgba(255,144,0,1); } nav#side_navi #snBasket.full span { display: block; position: absolute; left: -8px; bottom: -8px; width: 24px; height: 24px; background: rgba(228,5,22,1); border-radius: 12px; color: rgba(255,255,255,1); text-align: center; line-height: 22px; } nav#side_navi #snLogin { background-image: url('/pages2015/img/login.png'); } nav#side_navi #snMyShop { background-image: url('/pages2015/img/sn_user.png'); } nav#side_navi #snFav { background-image: url('/pages2015/img/sn_fav.png'); } nav#side_navi #snLogout { background-image: url('/pages2015/img/sn_logout.png'); } nav#side_navi #snExport { background-image: url('/pages2015/img/sn_export.png'); } nav#side_navi #snPrint { background-image: url('/pages2015/img/sn_print.png'); } nav#side_navi #snRecomment { background-image: url('/pages2015/img/sn_mail.png'); } nav#side_navi #snForum { background-image: url('/pages2015/img/sn_forum.png'); } #shadow, #shadow * { box-sizing: border-box; } #shadow { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100vH; background: rgba(0,0,0,0.7); z-index: 1000; } #shadow_container { position: relative; width: 550px; max-height: 86vH; margin: 7vH auto; padding: 3vH; border-radius: 10px; background: rgba(255,255,255,1); } #shadow_box { max-height: 80vH; overflow: auto; } #shadow_close { position: absolute; right: -15px; top: -15px; width: 30px; height: 30px; background: url(/pages2015/img/close_16.png) no-repeat center #ffffff; border-radius: 100%; border: 1px solid #dddddd; cursor: pointer; } #shadow_close:hover { background: url(/pages2015/img/close_16.png) no-repeat center #dddddd; } #shadow_container .login_container input { margin: 0 0 10px 0; } #shadow_container td { white-space: nowrap; } #shadow_container td:nth-child(2) { width: 100%; } .noPadding td { padding: 0 !important; } .noPadding td:first-child { padding: 0 5px 0 0 !important; } .img_cms { margin: 0 10px 10px 0; line-height: 1px; } .ui-icon, .ui-widget-content .ui-icon { background-image: url("/pages2015/jquery/jquery-ui-1.11.4/images/ui-icons_222222_256x240.png") !important; } .ui-accordion-header.ui-state-default { border: 1px solid #cccccc; background: #f2f3f4; color: #222222; } .ui-accordion-header.ui-state-active { border: 1px solid #cccccc; background: #ffffff; color: #222222; } #accordion .ui-accordion-header:hover { background: #a5a5a5; } .ui-widget-content { border: 1px solid #cccccc; background: #ffffff; color: #222222; } #tabs .ui-tabs-nav { background: linear-gradient(to bottom, #ffffff 0%,#ffffff 62%,#eeeeee 100%); } .pfeco_table td { padding: 5px 20px 5px 0; } .pfeco_table td:last-of-type { padding: 5px; }